<template>
  <c-form-dialog
    label-width="200px"
    title="项目受理"
    ref="form"
    :form-items="formItems"
    :form-data="formData"
    :table-name="tableName"
    :before-save="handleBeforeSave"
    :table-id="tableId"
    :auto-close="false"
    :submit="false"
    :dismiss="false"
    @success="emitSuccess"
    @dismiss="beforeClose"
    :visible.sync="innerVisible"
  >
    <el-form-item>
      <el-button
        @click="handleApprovalPass"
        class="btn-long"
        type="success"
        :loading="submitLoading"
      >
        确认受理
      </el-button>
      <el-button @click="beforeClose" class="btn-long" :loading="submitLoading">取消</el-button>
    </el-form-item>
  </c-form-dialog>
</template>

<script>
import { mapGetters } from 'vuex'
import { phoneValidator } from '@/common/plugins/validator'
import SelectCreditOrg from '@/bank/components/select/SelectCreditOrg'
export default {
  components: {},
  props: {
    visible: Boolean,
    whiteData: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {
      tableName: 'customer_related',
      formData: {},
      submitLoading: false,
      innerVisible: false,
      tableId: '',
      formItems: [
        {
          tag: SelectCreditOrg,
          itemAttrs: {
            label: '担保机构',
            rules: [{ required: true, message: '请选择担保机构', trigger: 'change' }],
          },
          attrs: {
            key: 'service_id',
            value: '',
            class: 'form-control-ml',
          },
          listeners: {
            select: select => {
              this.$refs.form.setAttrs('service_name', { value: select.org_name })
            },
          },
        },
        {
          tag: 'input',
          attrs: { key: 'service_name', value: '' },
          ifShow: false,
        },
        {
          tag: 'input',
          itemAttrs: { label: '申请金额' },
          attrs: { key: 'apply_funds', value: '' },
          tagSlots: [{ name: 'append', slot: '万元' }],
        },
        {
          tag: 'number',
          itemAttrs: {
            label: '银行预审金额',
            rules: [
              { required: true, message: '请填写银行预审金额', trigger: 'blur' },
              {
                validator: (rule, value, callback) => {
                  value = Number(value)
                  if (value <= 0) {
                    return callback(new Error('金额不能小于等于0'))
                  }
                  callback()
                },
                trigger: 'blur',
              },
            ],
          },
          attrs: { key: 'bank_approved_funds', value: '' },
          tagSlots: [{ name: 'append', slot: '万元' }],
        },
        {
          tag: 'number',
          itemAttrs: {
            label: '贷款年限',
            rules: [{ required: true, message: '请填写贷款年限', trigger: 'blur' }],
          },
          attrs: { key: 'approval_load_years', value: '' },
          tagSlots: [{ name: 'append', slot: '年' }],
        },
        {
          tag: 'input',
          itemAttrs: {
            label: '贷款用途',
            rules: { required: true, message: '请输入贷款用途', trigger: 'blur' },
          },
          attrs: { key: 'funds_use_dir', value: '' },
        },
        {
          tag: 'input',
          itemAttrs: {
            label: '项目经理',
            rules: [{ required: true, message: '请填写银行项目经理', trigger: 'blur' }],
          },
          attrs: { key: 'bank_approved_person', class: 'form-control-ml', value: '' },
        },
        {
          tag: 'input',
          itemAttrs: {
            label: '联系电话',
            rules: [
              { required: true, message: '请输入手机号码', trigger: 'blur' },
              { validator: phoneValidator, message: '请输入正确的手机号码', trigger: 'blur' },
            ],
          },
          attrs: { key: 'bank_approved_person_mobile', value: '', placeholder: '请输入联系电话' },
        },
      ],
    }
  },
  computed: {
    ...mapGetters(['user', 'clientId', 'org']),
    queryAddress() {
      return this.user.queryAddressCode
    },
  },
  watch: {
    visible(val) {
      this.innerVisible = val
    },
    whiteData: {
      handler: function () {
        this.$set(this.formData, 'apply_funds', this.whiteData.apply_funds)
        this.$set(this.formData, 'approval_load_years', this.whiteData.load_years)
        this.$set(this.formData, 'funds_use_dir', this.whiteData.funds_use_dir)
      },
      immediate: true,
      deep: true,
    },
  },
  created() {},
  mounted() {},
  methods: {
    beforeClose() {
      this.innerVisible = false
      this.$emit('update:visible', false)
    },
    handleBeforeSave(data) {
      data.submit_person_name = this.user.userName
      data.submit_client_id = this.clientId
      data.submit_client_name = this.org.orgName

      data.submit_type = 5
      data.customer_name = this.whiteData.customer_name
      data.address_code = this.whiteData.address_code
      data.address_detail = this.whiteData.address_detail
      data.org_class = this.whiteData.org_class
      data.register_no = this.whiteData.register_no
      data.corp_name = this.whiteData.corp_name
      data.lender_idcard = this.whiteData.id_card
      data.mobile_no = this.whiteData.mobile_no
      data.main_business = this.whiteData.main_business
      data.business_scope = this.whiteData.business_scope
      data.poverty_households = this.whiteData.poverty_households

      data.project_white_list_id = this.whiteData.project_white_list_id
      data.project_type_id = this.whiteData.project_type_id
      data.project_type_name = this.whiteData.project_type_name

      data.load_years = this.whiteData.load_years
      // data.claim_status = 1
      // data.claim_time = this.$utils.dateFormat(new Date(), 'yyyy-MM-dd hh:mm:ss')
      data.bank_id = this.clientId
      data.bank_code = this.org.orgCode
      data.bank_name = this.org.orgName
      return data
    },
    handleApprovalPass() {
      this.$refs.form.submit()
    },
    emitSuccess() {
      this.$emit('success', true)
    },
  },
}
</script>

<style lang="scss" scoped></style>
